<template>
	<view class="pages">

		<view class="box">
			<view class="box_herder flex align-items justify-content-between">
				<view class="box_herder_left">风险措施确认</view>
				<view class="box_herder_right flex align-items" v-if="obj.correlationNumbers.length>0" @click="getByOperateId">
					<view>关联票</view>
					<u-icon :name="show?'arrow-up':'arrow-down'" color="#999999" size="14"></u-icon>
				</view>
			</view>
			<view class="content">
				<!-- <view class="prompt">注：请按顺序执行</view> -->
				<view class="content_item" v-for="(v,i) in list" :key="i">
					<view class="content_item_title">{{i+1}}.{{v.identification}}</view>
					<view class="content_item_content">{{v.measure}}</view>
					<view class="content_item_rideo flex align-items " @click="rideoCikc(i)">
						<!-- <view class="yuan" v-if="v.types ==''"></view> -->
						<image class="imgyuan "  v-if="v.state == 1"  src="../../static/img/index/xuanzhong.png" mode=""></image>
						<view class="txt" v-if="v.state == 1" :class="{
							color: i!=idx 
						}"> 已执行</view>
					</view>
					<view class="content_item_upload " v-if="v.ifPhotograph ==1">
						<!-- 	<u-upload :fileList="v.file" :disabled="idx != i || v.state ==1"
							@afterRead="(event)=>afterRead(event,i)" @delete="(event)=>deletePic(event,i)" name="1"
							:maxCount="1"></u-upload> -->
						<view class="uploadlist">
							<block v-if="v.file.length>0">
								<view class="uploadlist_item" v-for="(vd , ixd) in v.file" :key="ixd">
									<image :src="vd.url" mode="aspectFill" class="uploadlist_item_image"
										@click="previewImage(vd.url)"></image>
									<image src="/static/delete.png" class="uploadlist_delet" @click="deltet(i,ixd,v)">
									</image>
								</view>
							</block>

							<view class="uploadlist_add" @click="uplaodImg(i,v)" v-if="v.file.length<=0">
								<u-icon name="plus" size="30" color="#E6E6E6"></u-icon>
							</view>
						</view>
					</view>
					<view class="flex  comit ">
						<view @click="stepComit(i)" v-if="v.state ==0"> 提交</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 安全措施 -->
		<!-- <view class="secure">
			<view class="secure_title">安全保护措施与用品</view>
			<view class="secure_item ">
				<view class="secure_item_labal">措施与用品</view>
				<view class="secure_item_value  flex align-items" @click="measure" style="flex: 1;">
				
					<div style="flex: 1;" class="measureValue" :class="{
						measureColor:!measureValue
					}">
						{{measureValue || '请选择'}}
					</div>
					<u-icon name="arrow-right" color="#CCCCCC" :size="16"></u-icon>
				</view>
			</view>
			<view class="secure_item" v-if="jsonType">
				<view class="secure_item_labal">其他</view>
				<view class="secure_item_value  flex align-items">
					<u-input placeholder="请输入 " v-model="value" :readonly="ifDisplay" :fontSize="16"
						placeholderClass="placeholderClass"></u-input>
				</view>
			</view>
		</view> -->
		<!-- 相关人员签字确认 -->
		<view class="secure" style="display: none;">
			<view class="secure_title">相关人员签字确认</view>
			<view class="secure_item flex align-items " style="border: none;">
				<view class="secure_item_labal laas">操作人</view>
				<view class="secure_item_values  ">
					{{obj.operateUserName || ''}}
				</view>
			</view>
			<view class="secure_item ">
				<view class="secure_item_labal">签字确认</view>
				<view class="secure_item_value  flex align-items flex-wrap">
					<block v-for="(v,i) in riskOperateSign" :key="i">
						<view class="border" @click="takePhoto('riskOperateSign',i)" v-if="v.fileUrl ==''">+</view>
						<image class="userSign" :src="baseURL+v.fileUrl" mode="" style="width: 100rpx;height: 100rpx;"
							v-else></image>
					</block>
				</view>
			</view>

			<view class="secure_item flex align-items " style="border: none;">
				<view class="secure_item_labal laas">监护人</view>
				<view class="flex flex-wrap values">
					<view class="secure_item_values " v-for="(v,i) in riskGuardianSign " :key="i">
						{{v.name}}
					</view>
				</view>
			</view>
			<view class="secure_item ">
				<view class="secure_item_labal">签字确认</view>
				<view class="secure_item_value  flex align-items flex-wrap">
					<block v-for="(v,i) in riskGuardianSign" :key="i">
						<view class="border" @click="takePhoto('riskGuardianSign',i)" v-if="v.fileUrl ==''">+</view>
						<image class="userSign" :src="baseURL+v.fileUrl" mode="" style="width: 100rpx;height: 100rpx;"
							v-else></image>
					</block>
				</view>
			</view>
			<view class="secure_item flex align-items " style="border: none;">
				<view class="secure_item_labal laas">一级审批</view>
				<view class="flex flex-wrap values">
					<view class="secure_item_values " v-for="(v,i) in riskMonitorSign " :key="i">
						{{v.name}}
					</view>
				</view>
			</view>
			<view class="secure_item ">
				<view class="secure_item_labal" style="flex: 0 0 auto;">签字确认</view>
				<view class="secure_item_value  flex align-items  flex-wrap margin-top10">
					<!-- 	<view class="border" @click="takePhoto">+</view> -->
					<block v-for="(v,i) in riskMonitorSign" :key="i">
						<view class="border" @click="takePhoto('riskMonitorSign',i)" v-if="v.fileUrl ==''">+</view>
						<image class="userSign" :src="baseURL + v.fileUrl" mode="" style="width: 100rpx;height: 100rpx;"
							v-else></image>

					</block>
				</view>
			</view>
			<view class="secure_item flex align-items " style="border: none;">
				<view class="secure_item_labal laas">二级审批</view>

				<view class="flex flex-wrap values">
					<view class="secure_item_values " v-for="(v,i) in riskShiftSign " :key="i">
						{{v.name}}
					</view>
				</view>
			</view>
			<view class="secure_item ">
				<view class="secure_item_labal" style="flex: 0 0 auto;">签字确认</view>
				<view class="  flex align-items flex-wrap" v-if=" obj.shiftSupervisorName">
					<view class="secure_item_value  flex align-items flex-wrap margin-top10">
						<!-- 	<view class="border" @click="takePhoto">+</view> -->
						<block v-for="(v,i) in riskShiftSign" :key="i">
							<view class="border" @click="takePhoto('riskShiftSign',i)" v-if="v.fileUrl ==''">+</view>
							<image class="userSign" :src="baseURL+v.fileUrl" mode=""
								style="width: 100rpx;height: 100rpx;" v-else></image>
						</block>
					</view>
				</view>

			</view>

		</view>
		<view class="btn" @click="nuxt"> 下一步</view>
		<!-- <u-picker :show="show" :columns="columns" @close="show =false" @confirm="confirm"></u-picker> -->
		<tree ref="tree" @comit="comit" :treeData="treeData"></tree>
		<u-popup :show="show" :round="10">
			<view class="block">
				<view class="block_item" v-for=" (v,i) in operateIdList" :key="i" @click="Navto(v)">
					{{v.orderNumber}} <text :style="{
						color:color.get(v.stateColour - 0)
					}
					">（{{txt.get(v.stateColour - 0)}}）</text>
				</view>
				<view class="hr"></view>
				<view class="block_close" @click="show =false">取消</view>
			</view>
		</u-popup>
		<helangcompress ref="helangCompress"></helangcompress>
	</view>
</template>

<script>
	import urlConfig from "@/request/urlConfig.js";
	import {
		orderRiskOperate
	} from '@/api/risks.js'
	import {
		byOperateId,
		orderRiskEnd
	} from '@/api/lssue.js'
	import helangcompress from '../helang-compress/helang-compress.vue'
	const color = new Map([
		[0, "#267DFF"],
		[1, "#E04734"],
		[2, "#8B8B8B"],
		[3, "#267DFF"],
		[4, "#E04734"],
	])
	const txt = new Map([
		[0, '待审批'],
		[1, '去处理'],
		[2, '已结束'],
		[3, '交接待确认'],
		[4, '作废'],
	])
	export default {
		components: {
			helangcompress
		},
		props: {
			listRisk: {
				type: Array,
				default: []
			},
			obj: {
				type: Object,
				default: {}
			}
		},
		data() {
			return {
				color,
				txt,
				baseURL: urlConfig.nearbyUrl,
				idx: 0,
				ifDisplay: true, // 定义一个变量 
				list: [],
				show: false,
				value: '',
				json: [],
				jsonType: false,
				measureValue: '',
				treeData: [{
						label: '安全帽',
						id: 1,
						checked: false,
					},
					{
						label: '安全鞋',
						id: 2,
						checked: false,
					},
					{
						label: '耳塞',
						id: 3,
						checked: false,
					},
					{
						label: '手套',
						id: 4,
						checked: false,
					}, {
						label: '安全绳/带',
						id: 5,
						checked: false,
					},
					{
						label: '防护眼镜',
						id: 6,
						checked: false,
					},
					{
						label: '呼吸器',
						id: 7,
						checked: false,
					},
					{
						label: '灭火器',
						id: 8,
						checked: false,
					},
					{
						label: '围栏',
						id: 9,
						checked: false,
					},
					{
						label: '护脸设备',
						id: 10,
						checked: false,
					},
					{
						label: '其他',
						id: 11,
						checked: false,
					},

				],
				operateIdList: [],
				riskOperateSign: [], //操作人
				riskGuardianSign: [], //监护人
				riskShiftSign: [], //值长
				riskMonitorSign: [], //值班长
			};
		},
		watch: {
			idx: (newVal, oldVal) => {
				console.log(newVal, oldVal);
			},
			listRisk: function(newVal, oldVal) {
				console.log(newVal, "newVal");
				this.list = [...newVal]
				console.log(this.list, "console.log");
				this.idx = this.findLastIndexWithStateOne(this.list)
				this.ifDis()
				this.riskOperateSign = this.obj.riskOperateSign ? [JSON.parse(this.obj.riskOperateSign)] : this
					.splitFun(
						'operateUserId', "operateUserName")
				this.riskGuardianSign = this.obj.riskGuardianSign ? JSON.parse(this.obj.riskGuardianSign) : this
					.splitFun(
						'guardianUserId', "guardianUserName")
				this.riskShiftSign = this.obj.riskShiftSign ? JSON.parse(this.obj.riskShiftSign) : this.splitFun(
					'shiftSupervisorId',
					"shiftSupervisorName")
				this.riskMonitorSign = this.obj.riskMonitorSign ? JSON.parse(this.obj.riskMonitorSign) : this.splitFun(
					'monitorUserId',
					"monitorUserName")
				this.measureValue = this.obj.riskSafetyProductJson ? JSON.parse(this.obj.riskSafetyProductJson).map(
					v => v.value).join(',') : ''
				console.log(this.riskOperateSign, this.riskGuardianSign, this.riskShiftSign, this.riskMonitorSign,
					"riskOperateSign");
			},
		},
		created() {
			this.list = [...this.listRisk]
			console.log(this.listRisk, "listRisk");
			console.log(this.list, "console.log");
			this.idx = this.findLastIndexWithStateOne(this.list)
			this.ifDis()
			this.riskOperateSign = this.obj.riskOperateSign ? [JSON.parse(this.obj.riskOperateSign)] : this.splitFun(
				'operateUserId', "operateUserName")
			this.riskGuardianSign = this.obj.riskGuardianSign ? JSON.parse(this.obj.riskGuardianSign) : this
				.splitFun(
					'guardianUserId', "guardianUserName")
			this.riskShiftSign = this.obj.riskShiftSign ? JSON.parse(this.obj.riskShiftSign) : this.splitFun(
				'shiftSupervisorId',
				"shiftSupervisorName")
			this.riskMonitorSign = this.obj.riskMonitorSign ? JSON.parse(this.obj.riskMonitorSign) : this.splitFun(
				'monitorUserId',
				"monitorUserName")
			this.measureValue = this.obj.riskSafetyProductJson ? JSON.parse(this.obj.riskSafetyProductJson).map(
				v => v.value).join(',') : ''
			console.log(this.riskOperateSign, this.riskGuardianSign, this.riskShiftSign, this.riskMonitorSign,
				"riskOperateSign");
		},
		onShow() {
			console.log("子标签 ");
			uni.$once('back', e => {
				console.log(e, "e");
				this[e.key][e.idx - 0].fileUrl = e.url
				// this.$forceUpdate()
			})
		},
		mounted() {},
		methods: {
			Navto(v) {
				this.show = false
				if (v.stateColour == 1) {
					// this.jumpTo('/pages/addPerform/addPerform', {
					// 	id: v.id,
					// 	// state: state != 4 ? 0 : 1
					// 	state: v.state == 1 ? 0 : v.state == 3 ? 1 : v.state == 4 ? 2 : 0
					// })
					let state = v.state == 1 ? 0 : v.state == 3 ? 1 : v.state == 4 ? 2 : 0
					uni.redirectTo({
						url: `/pages/addPerform/addPerform?id=${v.id}&state=${state}`
					});
				} else {
					// this.jumpTo('/pages/detailsPerform/detailsPerform',{
					// 	id:v.id
					// })
					uni.redirectTo({
						url: `/pages/detailsPerform/detailsPerform?id=${v.id}`
					});
				}

			},
			// 处理图片放大
			previewImage(url) {
				uni.previewImage({
					current: url,
					urls: [url],
					loop: true,
				})
			},
			// 定义一个方法  处理签字字段
			splitFun(idKey, nameKey) {
				// const ids = this.obj[idKey].split(',')
				// const names = this.obj[nameKey].split(',')
				// let arr = []
				// ids.forEach((v, i) => {
				// 	arr.push({
				// 		id: v,
				// 		name: names[i],
				// 		fileUrl: ''
				// 	})
				// })
				return []
			},

			takePhoto(key, idx) {
				const id = this[key][idx].id
				// console.log(id, "id");
				this.jumpTo('/pages/demo/demo', {
					key: key,
					idx: idx,
					id: this[key][idx].id
				})
				// uni.chooseImage({
				// 	count: 1, // 默认9，设置图片的数量
				// 	sourceType: ['camera'], // 可选择的源类型，'camera' 是相机
				// 	success: async (res) => {
				// 		uni.showLoading({
				// 			title: '对比中',
				// 		})
				// 		// 成功选择图片后的回调
				// 		console.log(res);
				// 		const a = await this.uploadFilePromises(res.tempFilePaths[0], id)
				// 		if (a.state == 1) {
				// 			this[key][idx].fileUrl = a.userSign
				// 		} else {
				// 			uni.$u.toast('当前人脸对比失败')
				// 		}
				// 		uni.hideLoading()
				// 		console.log(a, "a");
				// 		// res.tempFilePaths 是拍照后的图片临时文件路径数组
				// 	},
				// 	fail: (err) => {
				// 		// 调用失败的回调
				// 		console.log('调用失败：', err);
				// 	}
				// });
			},
			uploadFilePromises(url, id) {
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: urlConfig.baseURL + 'wsd/operateOrder/checkFileImages', // 仅为示例，非真实的接口地址
						filePath: url,
						name: 'file',
						formData: {
							userId: id
						},
						header: {
							'User-Token': uni.getStorageSync('token') || "",
						},
						success: (res) => {
							console.log(res, "res");
							setTimeout(() => {
								resolve(JSON.parse(res.data)
									.datas)
							}, 1000)
						},
						fail: (err) => {
							reject(err)
							uni.$u.toast('上传失败')
						}
					});
				})
			},
			// 根据id查询关联票
			async getByOperateId(id) {
				const res = await byOperateId({
					id: this.obj.id,
				})
				this.operateIdList = res.datas
				this.show = true
				console.log(res, "res");
			},


			findLastIndexWithStateOne(array) {
				let lastIndex = array.reduce((acc, curr, index) => {
					if (curr.state == 1) {
						return index;
					}
					return acc;
				}, -1);

				// 如果 lastIndex 仍然为 -1，表示数组中没有符合条件的元素，将 lastIndex 设为 0
				// if (lastIndex === -1) {
				// 	lastIndex = 0;
				// }
				return lastIndex == -1 ? 0 : lastIndex + 1;
			},
			// 提交
			stepComit(i) {
				const item = this.list[i]
				console.log(item, "item");
				if (item.ifPhotograph == 1 && item.file.length <= 0) return uni.$u.toast('请上传照片')
				// if (item.types === '') return uni.$u.toast('请执行操作')
				orderRiskOperate({
					id: item.id,
					fileUrl: item.file.map(v => v.urlTwo).join(',')
				}).then(res => {
					this.idx = i + 1
					this.list[i].state = 1
					this.ifDis()
					this.$forceUpdate()
					
				}).catch(error => {
					// uni.$u.toast(error)
				})
			},
			ifDis() {
				if (this.list.length == this.idx) {
					console.log('获取值');
					this.ifDisplay = false
					return
				}
			},
			rideoCikc(i) {
				// if (this.listRisk[i].type == '') return
				if (this.idx != i) return
				this.list[i].types = 1
				console.log(this.list[i], "	this.list[i]");
				this.$forceUpdate()

				// this.idx = i + 1
				// console.log(this.listRisk.length, this.idx, "length");
				// if (this.listRisk.length == this.idx) {
				// 	console.log('获取值');
				// 	this.ifDisplay = false
				// 	return
				// }
			},
			measure() {
				console.log(this.ifDisplay);
				if (this.obj.riskSafetyProductJson != '') return
				if (this.ifDisplay) return uni.$u.toast('请按顺序执行')
				if (this.obj.submitRiskDate) return uni.$u.toast('请按顺序执行')
				this.$refs.tree.itemclick(true, false)
			},
			comit(e) {
				console.log(e, "返回值");
				this.json = e
				this.measureValue = e.map(v => v.label).join(',')
				let arr = e.filter(v => v.label == '其他')
				if (arr.length > 0) {
					this.jsonType = true
				} else {
					this.value = ''
					this.jsonType = false
				}
			},
			nuxt() {
				if (this.obj.state == 4) {
					this.$emit("nuxt", 2)
					return
				}
				console.log(this.idx, this.list.length, );
				if (this.idx != this.list.length) return uni.$u.toast('请填写风险措施确认')
				// if (this.riskOperateSign.filter(v => v.fileUrl == '').length > 0) return uni.$u.toast('请上传操作人签名照')
				// if (this.riskGuardianSign.filter(v => v.fileUrl == '').length > 0) return uni.$u.toast('请上传监护人签名照')
				// if (this.riskShiftSign.filter(v => v.fileUrl == '').length > 0) return uni.$u.toast('请上传值长签名照')
				// if (this.riskMonitorSign.filter(v => v.fileUrl == '').length > 0) return uni.$u.toast('请上传值班长签名照')
				let riskSafetyProductJson
				if (this.measureValue) {
					riskSafetyProductJson = this.measureValue.split(',').map(v => {
						return {
							value: v
						}
					})
				}

				if (this.value != '') {
					riskSafetyProductJson.push({
						value: this.value
					})
				}
				uni.showLoading({
					title: "加载中",
					mask: true
				})
				orderRiskEnd({
					id: this.obj.id,
					riskSafetyProductJson: JSON.stringify(riskSafetyProductJson),
					riskOperateSign: JSON.stringify(this.riskOperateSign[0]),
					riskGuardianSign: JSON.stringify(this.riskGuardianSign),
					riskShiftSign: JSON.stringify(this.riskShiftSign),
					riskMonitorSign: JSON.stringify(this.riskMonitorSign)
				}).then(res => {
					uni.hideLoading()
					this.$emit("nuxt", 2)
				})

			},
			// // 处理图片放大
			// previewImage(url) {
			// 	uni.previewImage({
			// 		current: url,
			// 		urls: [url],
			// 		loop: true,
			// 	})
			// },
			// 删除图片
			deletePic(event, idx) {
				console.log(this.list[idx].state);
				if (this.list[idx].state == 1) return
				console.log(event, idx);
				let items = this.list[idx].file
				items.splice(event.index, 1)
				this.list[idx].file = [...items]
				console.log(this.list[idx].file);
				this.$forceUpdate()
			},
			uplaodImg(idx, row) {
				// :disabled="idx != i || v.state ==1"
				if (this.idx != idx || row.state == 1) return
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album'], //从相册选择
					success: (res) => {
						// console.log(JSON.stringify(res.tempFilePaths));
						let that = this;
						this.$refs.helangCompress
							.compress(res.tempFiles[0], that, 1)
							.then((uploadRes) => {
								console.log(uploadRes, "res");
								this.list[idx].file.push({
									url: urlConfig.nearbyUrl + uploadRes.datas.file_path,
									urlTwo: uploadRes.datas.file_url,
								})
								console.log(this.list[idx]);
								this.$forceUpdate()
							});
					}
				})
			},
			deltet(i, idx, row) {
				if (row.state == 1) return
				this.list[i].file.splice(idx, 1)
				this.$forceUpdate()
			},
			// 新增图片
			async afterRead(event, idx) {
				uni.showLoading({
					title: '上传中',
					mask: true
				})
				console.log(event, "/pages/staging/staging");
				let items = this.list[idx].file
				let lists = [].concat(event.file)
				let fileListLen = items.length
				lists.forEach((item) => {
					this.list[idx].file.push({
						...item,
						status: 'uploading',
						message: '上传中'
					})
				})
				for (let i = 0; i < lists.length; i++) {
					console.log(lists[i].url, "lists[i].url");
					const result = await this.uploadFilePromise(lists[i].url)
					console.log(result, "result");
					let item = items[fileListLen]
					items.splice(fileListLen, 1, Object.assign(item, {
						status: 'success',
						message: '',
						url: urlConfig.nearbyUrl + result.file_path,
						urlTwo: result.file_url,
					}))
					fileListLen++

				}
				this.list[idx].file = [...items]
				this.$forceUpdate()
				// uni.hideLoading()
				console.log(this.list[idx].file, "this.list[idx].file");
			},
			uploadFilePromise(url) {
				console.log(urlConfig.baseURL, "urlConfig.baseUrl");
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: urlConfig.baseURL + 'sys/file/uploadFile', // 仅为示例，非真实的接口地址
						filePath: url,
						name: 'file',
						formData: {
							user: 'test'
						},
						header: {
							'User-Token': uni.getStorageSync('token') || "",
							// 'Content-Type': 'multipart/form-data',
						},
						success: (res) => {
							console.log(JSON.parse(res.data).datas.file_url, "res");
							setTimeout(() => {
								resolve(JSON.parse(res.data).datas)
							}, 1000)

						},
						fail: () => {
							uni.$u.toast('上传失败')
							reject(err)
							uni.hideLoading()
						}
					});
				})
			},
		}
	}
</script>

<style>
	page {
		background-color: #F5F5F5;
		padding-bottom: 40rpx;
	}
</style>
<style lang="scss" scoped>
	.pages {
		padding-bottom: 80rpx;
	}

	.herder {
		height: 170rpx;
		background: #FFFFFF;
		padding-top: 46rpx;
	}

	.box {
		margin-top: 18rpx;
		background-color: #FFFFFF;
		padding: 29rpx 34rpx;
		padding-bottom: 0;

		&_herder {
			padding-bottom: 29rpx;
			border-bottom: 1rpx solid #f5f5f5;

			&_left {
				font-family: PingFangSC, PingFang SC;
				font-weight: 500;
				font-size: 33rpx;
				color: #000000;
			}

			&_right {
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 29rpx;
				color: #999999;

				view {
					margin-right: 23rpx;
				}
			}
		}
	}

	.content {
		.prompt {
			margin-top: 21rpx;
			font-weight: 400;
			font-size: 25rpx;
			color: #FF0000;
			text-align: left;
			font-style: normal;
		}

		&_item {
			width: 693rpx;
			margin: 0 auto;
			margin-top: 17rpx;
			padding-bottom: 16rpx;
			border-bottom: 1rpx solid #E6E6E6;

			&_title {
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 29rpx;
				color: #267DFF;
				line-height: 40rpx;
			}

			&_content {
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 25rpx;
				color: #000000;
				margin-top: 10rpx;
				line-height: 36rpx;
			}

			&_rideo {
				margin-top: 17rpx;

				.yuan {
					width: 31rpx;
					height: 31rpx;
					border: 2rpx solid #E6E6E6;
					border-radius: 50%;
					margin-right: 14rpx;
				}

				.txt {
					font-family: PingFangSC, PingFang SC;
					font-weight: 400;
					font-size: 25rpx;
					color: #000000;
				}

				.color {
					color: #8B8B8B;
				}

				.imgyuan {
					width: 34rpx;
					height: 34rpx;
					margin-right: 14rpx;
				}
			}

			&_upload {
				margin-top: 25rpx;
			}
		}

		&_item:last-child {
			border: none;
		}
	}

	.secure {
		margin-top: 21rpx;
		background-color: #FFF;
		padding: 0 30rpx;

		&_title {
			height: 105rpx;
			font-family: PingFangSC, PingFang SC;
			font-weight: 500;
			font-size: 33rpx;
			color: #000000;
			line-height: 105rpx;
			border-bottom: 1rpx solid #E6E6E6;
		}

		&_item {
			min-height: 105rpx;
			display: flex;
			align-items: center;
			border-bottom: 1rpx solid #E6E6E6;
			padding-bottom: 10rpx;

			&_labal {
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 33rpx;
				color: #666666;
				width: 195rpx;
			}

			&_value {
				// flex: 1;
			}

			&_values {
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 33rpx;
				color: #000000;
				margin-right: 20rpx;
			}
		}

		&_item:last-child {
			border: none;
		}

		.border {
			width: 153rpx;
			height: 69rpx;
			border: 2rpx solid #267DFF;
			text-align: center;
			line-height: 69rpx;

			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 29rpx;
			color: #267DFF;
			margin-right: 15rpx;
			margin-top: 15rpx;
		}
	}

	/deep/.placeholderClass {
		font-weight: 400;
		font-size: 26rpx;
		color: #CCCCCC;
	}

	.laas::before {
		content: '*';
		color: #FF0000;
	}

	.btn {
		height: 89rpx;
		text-align: center;
		line-height: 89rpx;
		margin-top: 20rpx;
		color: #FFF;
		background-color: #267DFF;
		position: fixed;
		width: 100%;
		bottom: 0;
		z-index: 100;
	}

	.comit {
		justify-content: flex-end;
		margin-top: 15rpx;

		view {
			padding: 8rpx 18rpx;
			border: 1rpx solid #267DFF;
			border-radius: 8rpx;
			font-size: 26rpx;
			color: #267DFF;
		}
	}

	/deep/.u-upload__button {
		width: 100rpx !important;
		height: 100rpx !important;
	}

	/deep/.u-upload__status {
		width: 100rpx !important;
		height: 100rpx !important;
	}

	/deep/ .u-upload__wrap__preview__image {
		width: 100rpx !important;
		height: 100rpx !important;
	}

	.block {
		&_item {
			width: 750rpx;
			height: 123rpx;
			font-weight: 400;
			color: #000000;
			line-height: 45rpx;
			text-align: right;
			font-style: normal;
			text-align: center;
			line-height: 123rpx;
			border-bottom: 1rpx solid #F5F5F5;
		}

		.hr {
			height: 10rpx;
			background-color: #F5F5F5;
		}

		&_close {
			height: 123rpx;

			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 33rpx;
			color: #000000;
			text-align: center;
			line-height: 123rpx;
		}
	}

	.measureValue {
		font-size: 32rpx;
	}

	.measureColor {
		color: #666666;
	}

	.values {
		flex: 1;

		view {
			margin: 10rpx;
		}
	}

	.userSign {
		margin-right: 10rpx;
		margin-top: 10rpx;
	}

	.uploadlist {
		display: flex;

		&_item {
			position: relative;
			margin-left: 10rpx;

			&_image {
				height: 150rpx;
				width: 150rpx;
				border-radius: 6rpx;
			}
		}

		&_delet {
			position: absolute;
			width: 30rpx;
			height: 30rpx;
			top: 0;
			right: 0;
			z-index: 10;
			background-color: #000000;
		}

		&_add {
			height: 150rpx;
			width: 150rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			border: 1rpx solid #E6E6E6;
			border-radius: 6rpx;
		}
	}
</style>